<template>
    <div>
        <Row style="margin:5px 0px 10px 5px">
            <i-col span="1" >
                <Button  size="default"  type="primary" @click="btn_refresh">刷新</Button>
            </i-col>
        </Row>
        <i-table size="default"   border stripe  :columns="format" :data="show_list" :height="sharedState.tableHeight" >
            <template slot-scope="{ row, index }" slot="action">
                <Button  size="default"  type="error"   style="margin-bottom: 5px "  @click="del_sa(index)">删除</Button>
            </template>
        </i-table >
        <div style="text-align: center;margin-top: 10px;">
            <Page ref="page" :total="total" :page-size="pageSize"  @on-change="changePage" show-total/>
        </div>
    </div>
</template>
<script>
import axios from 'axios';
import { get_service_account_list,delete_service_account } from  '@/api'
import { delete_namespace_resource } from '@/common/util.js'
import store from '@/store'

export default {
    data() {
        return {
            sharedState: store.state,
            format: [
                {
                    title: '名字',key: 'name'
                },
                {
                    title: '命名空间',key: 'namespace'
                },
                // {
                //     title: '标签',key: 'labels',width:500,
                //     render: (h, params) => {
                //         return h('div', [
                //             h('pre', JSON.stringify(params.row.labels,undefined,4))
                //         ]);
                //     }
                // },
                {
                    title: 'secret_list',key: 'secret_list',
                },
                {
                    title: '创建时间',key: 'create_time'
                },
                {
                    title: '操作',slot: 'action',width: 100,align: 'center'
                }
            ],
            total_list: [],
            show_list: [],
            // 分页
            total: 0,
            pageSize: 15,
        }
    },
    methods: {
		btn_refresh(){
            this.refresh()
        },
        del_sa(index){
            let name = this.show_list[index].name
            let result = confirm("确定要删除"+name+"吗?")
            if(result == false) return 
            let namespace = this.show_list[index].namespace
            delete_namespace_resource(namespace,name,delete_service_account)
            this.refresh()
        },
        changePage(index) {
            let _start = (index -1) * this.pageSize
            let _end = index * this.pageSize
            this.show_list = this.total_list.slice(_start,_end)
        },
        refresh() {
            let cluster = localStorage.getItem('currentCluster')
            let namespace = localStorage.getItem('currentNameSpace')
            let url = get_service_account_list
            let headers = {"cluster_name": cluster }
            let method='post'
            let data = {"namespace":namespace}
            if(cluster){
                axios({
                    url:url,headers: headers,data:data,method:method
                }).then( (response) => {
                    this.total_list = response.data
                    this.total = response.data.length
                    // 数量少于分页大小，则显示返回数据，否则显示当前选中的页数据
                    if(this.total < this.pageSize) {
                        this.show_list = this.total_list
                    }else {
                        // 修改改数据之后显示回到第一页的bug，改为停留在当前页
                        let currentPage = this.$refs.page.currentPage
                        let _start = (currentPage-1) * this.pageSize
                        let _end = currentPage * this.pageSize
                        this.show_list = this.total_list.slice(_start,_end)
                    }
                })
            }
        }
    },
    mounted: function() {
        console.log(delete_service_account)
        setTimeout(() =>{
            this.refresh();
        },200); 
    }
}
</script>
<style>
    pre{
        white-space: pre-wrap!important;
        word-wrap: break-word!important;
        *white-space:normal!important;
    }
</style>